<script lang="ts" setup>
import type { VbenFormProps } from '#/adapter/form';
import type { VxeGridProps } from '#/adapter/vxe-table';

import { Page, useVbenModal } from '@vben/common-ui';


import { useVbenVxeGrid } from '#/adapter/vxe-table';

import { columns, formSchema } from './company.data.js';

defineOptions({ name: 'SystemCompany' });



const formOptions: VbenFormProps = {
  schema: formSchema,
  showCollapseButton: false,
  actionButtonsReverse: true,
  // 大屏一行显示4个，中屏一行显示3个，小屏一行显示2个
  wrapperClass: 'grid-cols-2 md:grid-cols-3 lg:grid-cols-4',
};

const gridOptions: VxeGridProps = {
  columns,
  pagerConfig: { pageSize: 10 },
  proxyConfig: {
    ajax: {
      query: async ({ page }, formValues) => {
        const params = Object.assign({}, formValues, {
          pageNo: page.currentPage,
          pageSize: page.pageSize,
        });
        return await getUserTableApi(params);
      },
    },
  },
  stripe: true,
  rowConfig: {
    isHover: true,
  },
};

/** 查询公司信息 */
async function getUserTableApi(formData) {
  return {
    items: [
      {
        companyName: '测试公司',
        companyCode:'demo',
        subName: '测试',
        projectName: '测试项目',
      },
      {
        companyName: '测试公司111',
        companyCode:'demo11',
        subName: '测试111',
        projectName: '测试项目',
      }
    ],
    total: 2,
  };
}

const [Grid] = useVbenVxeGrid({
  formOptions,
  gridOptions,
});




</script>

<template>
  <Page>
    <Grid table-title="公司列表">
    </Grid>
  </Page>
</template>
